<template>
    <div>
        <el-row>
            <el-col :span="8">
                <el-tag type="warning" class="mb5">
                    小程序首页【滚动】公告文字：
                </el-tag>
                <el-form :model="distributorData1" status-icon
                    :rules="distributorRules1" ref="distributorData1" label-width="90px"
                >
                    <el-form-item label="滚动文字：" prop="notice">
                        <el-input type="textarea" size="small"
                            v-model="distributorData1.notice"
                        ></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="subDistributor1"
                            size="small"
                        >
                            提交修改
                        </el-button>
                    </el-form-item>
                </el-form>
                <div class="h1 backCol2d224d"
                ></div>
                <div class="mt20 mb5 backColRgba230a162a60as1 bor1SRgba230a162a60as2 colE6a23c pl10 pr10 lh30 borRad4 boSiBorBox ">
                    小程序首页【弹窗】公告文字（英文“|”分隔行）：
                    <div>
                        ● 倒数第2个“|”右边是：按钮文字
                    </div>
                    <div>
                        ● 倒数第1个“|”右边是：按钮的跳转链接，没有跳转链接就不填，但也得有最后的“|”
                    </div>
                    <div>
                        ● 比如无跳转：1.第一行|2.第二行|3.第三行|我已阅读|
                    </div>
                    <div>
                        ● 比如有跳转：1.第一行|2.第二行|3.第三行|我已阅读|/pages/personalCenter/index
                    </div>
                </div>
                <el-form :model="distributorData2" status-icon
                    :rules="distributorRules2" ref="distributorData2" label-width="90px"
                >
                    <el-form-item label="弹窗文字：" prop="text">
                        <el-input type="textarea" size="small"
                            v-model="distributorData2.text"
                        ></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="subDistributor2"
                            size="small"
                        >
                            提交修改
                        </el-button>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
    </div>
</template>
<script>
import { getNoticeInfo, saveNoticeInfo, getOffNotice,
    saveOffNotice } from '@s/api'
export default {
    data() {
        let textCheck = (rule, value, callback) => {
          if (value === '' || value === null) {
            callback(new Error('请输入弹窗文字'));
          } else {
            callback();
          }
        };
        return {
            distributorData1: { notice: '' },
            distributorRules1: {},
            distributorData2: { text: '' },
            distributorRules2: {
                text: [{ validator: textCheck, trigger: 'blur' }]
            }
        }
    },
    mounted() {
        this.getDataList1();
        this.getDataList2();
    },
    methods: {
        getDataList1() {
            getNoticeInfo({token: this.$store.getters.token}).then(res => {
                if(res.data && res.data.text) this.distributorData1.notice = res.data.text;
            })
        },
        getDataList2() {
            getOffNotice({token: this.$store.getters.token}).then(res => {
                console.log(123, res)
                this.distributorData2.text = res.data.text;
            })
        },
        subDistributor1() {
            this.$refs['distributorData1'].validate(valid => {
                if (valid) {
                    this.$confirm('确定修改滚动公告文字？', '提示', {
                        confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning'
                    }).then(() => {
                        let postData = new FormData(); 
                        postData.append('token', this.$store.getters.token);
                        postData.append('notice', this.distributorData1.notice);
                        saveNoticeInfo(postData).then(res => {
                            this.$message({ type: "success", message: '修改滚动公告成功' });
                        })
                    }).catch(() => { });
                }
            })
        },
        subDistributor2() {
            this.$refs['distributorData2'].validate(valid => {
                if (valid) {
                    this.$confirm('确定修改弹窗公告文字？', '提示', {
                        confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning'
                    }).then(() => {
                        let postData = new FormData(); 
                        postData.append('token', this.$store.getters.token);
                        postData.append('text', this.distributorData2.text);
                        saveOffNotice(postData).then(res => {
                            this.$message({ type: "success", message: '修改弹窗公告成功' });
                        })
                    }).catch(() => { });
                }
            })
        }
    }
}
</script>